// 基于准备好的dom，初始化echarts实例
// var myChart = echarts.init(document.getElementById('main'));

var handler = new MonitorCharts.Init(document.getElementById('main'), {
    //legendPosition: 'bottom',
    legendPosition: 'right',
    unit: 'percent',
    title: 'CPU Monitor',
    seriesAreaStyle: {},

    // "yyyy-MM-dd hh:mm:ss.S" ==> 2006-07-02 08:09:04.423
    // "yyyy-M-d h:m:s.S" ==> 2006-7-2 8:9:4.18
    // h:mm ==> 4:00, 11:30
    // timeAxisFormatter: 'h:mm'
}, {
});


$.getJSON('./ES.json', function (jsonData) {
    console.warn(jsonData);

    let mockSeries = jsonData.data.map((item) => {
        return {
            type: 'line',           // 折线图类型
            name: item.target,      // 折线名称  
            data: item.datapoints,  // 数据结构 [[time,value]]
            symbol: 'none',         // 坐标点显示与否
            smooth: true,           // 曲线是否光滑
            areaStyle: undefined    // {} 表示光滑数据
        };
    });
    handler.myChart.setOption({
        series: mockSeries // 新的值
    }); // 使用echart的配置进行重新组装数据
    handler.statisticUnit.calcStatistic();  // 重新计算统计数据
});

// mockData = [mockData[0]];
// handler.setData(mockData);

setInterval(() => {
    let curDataPoints = mockData[0].datapoints;
    curDataPoints.push([
        curDataPoints[curDataPoints.length - 1][0] + Math.round(Math.random() * 10) - 5,
        curDataPoints[curDataPoints.length - 1][1] + 60000
    ]);
    //curDataPoints.shift();
    //handler.setData(mockData);

    // let curData = [
    //     curDataPoints[curDataPoints.length - 1][0] + Math.round(Math.random() * 10) - 5,
    //     curDataPoints[curDataPoints.length - 1][1] + 60000
    // ];
    // handler.myChart.appendData({
    //     seriesIndex: 0,
    //     data:
    //         curData

    // })
}, 2000);


handler.onSelectDayView(function () {
    console.warn('day');
    // handler.setData([{
    //     target: 'dayView',
    //     datapoints: [
    //         [1, new Date().getTime()],
    //         [-1, new Date().getTime() + 2000],
    //         [-0.5, new Date().getTime() + 4000]
    //     ]
    // }]);

});
handler.onSelectWeekView(function () {
    console.warn('week');
    handler.setData([{
        target: 'WeekView',
        datapoints: [
            [11, new Date('2021-01-02').getTime()],
            [-12, new Date('2021-01-09').getTime()],
            [-0.5, new Date().getTime()]
        ]
    }]);
});
handler.onSelectMonthView(function () {
    console.warn('month');
    handler.setData([{
        target: 'WeekView',
        datapoints: [
            [1, new Date('2021-02-01').getTime()],
            [-12, new Date('2021-03-01').getTime()],
            [-0.5, new Date('2021-04-01').getTime()]
        ]
    }]);
});

// handler.selectDayMode();